<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<link type="text/css" rel="stylesheet" href="css/dth.css" />
	<title>SetupBox admin</title>
	<style>
.myTable td:nth-child(1) {
	width: 25px;
}

.admin_menu_setup_box {
	background: #0FD1D1 !important;
}

.feild-input {
	float: left;
	margin-bottom: 4px;
	margin-top: 4px;
	width: 100%;
}

.feild-input label {
	float: left;
	margin-right: 4px;
	text-align: right;
	width: 20%;
}

.feild-action {
	width: 100%;
	height: 20%;
	float: right;
}

.feild-action button {
	float: right;
	margin-right: 5px;
}
</style>
</h:head>

<h:body>


	<p:ajaxStatus
		style="bottom: 68%;
	    height: 32px;
	    position: fixed;
	    right: 50%;
	    width: 32px;
	    z-index: 99999;">
		<f:facet name="start">
			<p:graphicImage value="images/loading.gif" />
		</f:facet>

		<f:facet name="complete">
			<h:outputText value="" />
		</f:facet>
	</p:ajaxStatus>
	<p:growl id="growl" showDetail="true" sticky="false" />
	<ui:insert name="header">
		<ui:include src="/header/header_dth.xhtml" />
	</ui:insert>
	<div class="dth_body_home">
		<ui:insert name="header_banner">
			<ui:include src="/header/header_banner.xhtml" />
		</ui:insert>





		<div class="dth_content">
			<div class="dth_admin_menu">
				<h:form rendered="#{loginBean.role!=1}" id="notaccess">
					<a href="welcome.xhtml"
						style="text-decoration: none; font-size: 50px; color: red; width: 300px">Return
						Home</a>
					<p:sticky target="notaccess"></p:sticky>
				</h:form>


				<h:form rendered="#{loginBean.role==1}" id="menu">



					<ui:insert name="header_banner">
						<ui:include src="/header/menu_admin.xhtml" />
					</ui:insert>

				</h:form>
			</div>
			<div style="width: 82%; height: 100%; float: left;">
				<div class="menu_top1">
					<h:form id="dlgform">
						<p:dialog header="#{msg['header_insert']} #{msg['menu_admin_setupbox']}" widgetVar="dlg" id="dlg"
							width="600" height="530" resizable="false">
							<h:panelGroup id="dlgisert">
								<h:inputHidden value="#{setupboxBean.id}"></h:inputHidden>
								<h:inputHidden value="#{setupboxBean.fkAdminId}"></h:inputHidden>
								<div class="feild-input">
									<h:outputLabel value="#{msg['type']}" style="width:60px;"></h:outputLabel>
									<h:inputText id="type" value="#{setupboxBean.type}"
										style="width:150px;"></h:inputText>
									<p:watermark for="type" value="type of setup box" />
								</div>
								<div class="feild-input">
									<h:outputLabel value="#{msg['description']}" style="width:60px;"></h:outputLabel>
									<p:editor value="#{setupboxBean.des}" width="400" height="275"
										style="float:left;"></p:editor>
								</div>
								<div class="feild-input">
									<h:outputLabel value="#{msg['price']}" style="width:60px;"></h:outputLabel>
									<h:inputText value="#{setupboxBean.price}" style="width:150px;"></h:inputText>
								</div>
								<!-- chon hinh trong form insert -->
								<div class="feild-input">
									<h:outputLabel value="Image" style="width:60px;"></h:outputLabel>
									<h:inputText id="upload" style="width:400px" disabled="true"
										value="#{setupboxBean.fileName}"></h:inputText>
								</div>
								<div class="feild-input">
									<p:fileUpload fileUploadListener="#{setupboxBean.upload}"
										mode="advanced" dragDropSupport="true" sizeLimit="1000000"
										allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
										invalidSizeMessage="The maximum file size allowed is 10 Megabytes !"
										invalidFileMessage="You are allowed to upload only images !"
										update=":growl,:dlgform:upload,:dlgform:upload1,:dlgform:imgtemp" />
								</div>
								<div class="feild-action">
									<h:inputHidden value="#{setupboxBean.fileName}" id="imgtemp"></h:inputHidden>
									<p:commandButton id="upload1" style="float: right" value="#{msg['btn_ok']}"
										oncomplete="dlg.hide()" action="#{setupboxBean.insert}"
										update=":mainform,:growl">
										<f:param value="#{setupboxBean.fileName}" name="filename"></f:param>
									</p:commandButton>
									<p:commandButton value="#{msg['btn_cancel']}"
										action="#{setupboxBean.delImg2()}" oncomplete="dlg.hide()"></p:commandButton>
								</div>
							</h:panelGroup>

						</p:dialog>
					</h:form>

					<h:form id="dlgform2" rendered="#{loginBean.role==1}">
						<p:dialog header="Infomation Setup Box" widgetVar="dlg2" id="dlg2"
							width="600" height="550" resizable="false">
							<h:panelGroup id="dlgupdate">
								<h:inputHidden value="#{setupboxBean.id}"></h:inputHidden>
								<h:inputHidden value="#{setupboxBean.fkAdminId}"></h:inputHidden>
								<div class="feild-input">
									<h:outputLabel value="#{msg['type']}" style="width:60px;"></h:outputLabel>
									<h:outputText value="#{setupboxBean.type}"></h:outputText>
								</div>
								<div class="feild-input">
									<h:outputLabel value="#{msg['description']}" style="width:60px;"></h:outputLabel>
									<p:editor value="#{setupboxBean.des}" width="400" height="275"
										style="float:left;"></p:editor>
								</div>
								<div class="feild-input">
									<h:outputLabel value="#{msg['price']}" style="width:60px;"></h:outputLabel>
									<h:inputText value="#{setupboxBean.price}" style="width:150px;"></h:inputText>
								</div>
								<!-- chon hinh trong form update -->
								<div class="feild-input">
									<h:outputLabel value="Image Old: " style="width:60px;"></h:outputLabel>
									<h:inputText disabled="true" value="#{setupboxBean.imageOld}"
										style="width:400px;"></h:inputText>
								</div>
								<div class="feild-input">
									<h:outputLabel value="Image: " style="width:60px;"></h:outputLabel>
									<h:inputText id="upload" disabled="true"
										value="#{setupboxBean.image}" style="width:400px;"></h:inputText>
								</div>
								<div class="feild-input">
									<p:fileUpload fileUploadListener="#{setupboxBean.upload}"
										mode="advanced" dragDropSupport="true"
										update=":growl,:dlgform2:upload,:dlgform2:upload1,:dlgform2:imgtemp"
										sizeLimit="1000000" allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
										invalidSizeMessage="The maximum file size allowed is 10 Megabytes !"
										invalidFileMessage="You are allowed to upload only images !"></p:fileUpload>
								</div>
								<div class="feild-action">
									<h:inputHidden value="#{setupboxBean.imageOld}"></h:inputHidden>
									<h:inputHidden value="#{setupboxBean.type}"></h:inputHidden>
									<h:inputHidden value="#{setupboxBean.image}" id="imgtemp"></h:inputHidden>
									<p:commandButton id="upload1" style="float: right" value="#{msg['btn_ok']}"
										oncomplete="dlg2.hide()" action="#{setupboxBean.insert}"
										update=":mainform,:growl">
										<f:param value="#{setupboxBean.type}" name="setupboxBean_type"></f:param>
										<f:param value="#{setupboxBean.image}" name="filename"></f:param>
									</p:commandButton>
									<p:commandButton value="#{msg['btn_cancel']}"
										action="#{setupboxBean.delImg1()}" oncomplete="dlg2.hide()">
									</p:commandButton>
								</div>
							</h:panelGroup>

						</p:dialog>
					</h:form>

					<h:form rendered="#{loginBean.role==1}">
						<p:commandButton onclick="dlg.show()" title="#{msg['btn_insert']}"
							icon="ui-icon ui-icon-plusthick" update=":dlgform:dlgisert">
							<f:param value="sundth.PNG" name="imageI"></f:param>
							<f:param value="insert" name="action"></f:param>
						</p:commandButton>
						<h:outputText value="Infomation Setup Box"
							style="font-weight: bold;" />
					</h:form>

					<h:form id="form_confirm_delete_setupbox"
						rendered="#{loginBean.role==1}">
						<p:confirmDialog id="confirm_delete_setupbox"
							message="#{msg['delete_mess']}" header="#{msg['header_warning']}" width="400"
							showEffect="clip" closable="false"
							widgetVar="confirm_del_setupbox">
							<h:panelGroup id="data">
								<h:inputHidden value="#{setupboxBean.id}"></h:inputHidden>
								<h:inputHidden value="#{setupboxBean.image}"></h:inputHidden>
								<div class="feild-action">
									<p:commandButton value="#{msg['btn_no']}"
										onclick="confirm_del_setupbox.hide()"></p:commandButton>
									<p:commandButton style="float: right" value="#{msg['btn_yes']}"
										action="#{setupboxBean.delete()}" 
										onclick="confirm_del_setupbox.hide()" update=":mainform,:growl"></p:commandButton>
								</div>
							</h:panelGroup>


						</p:confirmDialog>
					</h:form>
				</div>


				<h:panelGroup id="mainform" rendered="#{loginBean.role==1}">
					<h:form>
						<p:dataTable styleClass="myTable" var="item" sortMode="multiple"
							paginator="true" rows="4" paginatorPosition="bottom"
							paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
							value="#{setupboxBean.listSetupBox}" rowIndexVar="row"
							filteredValue="#{setupboxBean.filteredSetupBox}">
							<p:column headerText="Stt">
								<h:outputText value="#{row+1}" />
							</p:column>
							<p:column headerText="#{msg['type']}" filterMatchMode="contains"
								filterBy="#{item.type}">
								<h:outputText style="float:left;" value="#{item.type}">
								</h:outputText>
							</p:column>
							<p:column headerText="#{msg['description']}">
								<h:outputText style="float:left;" escape="false"
									value="#{item.description}">
								</h:outputText>
							</p:column>
							<p:column headerText="#{msg['price']}">
								<h:outputText style="float:left;" value="#{item.priceStr}$">
								</h:outputText>
							</p:column>
							<p:column headerText="#{msg['date_insert']}">
								<h:outputText style="float:left;" value="#{item.dateInsert}">
								</h:outputText>
							</p:column>
							<p:column headerText="Image" style="width:250px">
								<img width="250px" height="130px" src="images/#{item.image}"
									alt="#{item.type}" />
							</p:column>
							<p:column headerText="#{msg['menu_action']}">
								<h:form>
									<p:commandLink onclick="confirm_del_setupbox.show()"
										style="margin-left: 8%"
										update=":form_confirm_delete_setupbox:data,:growl">
										<f:param value="delete" name="action"></f:param>
										<f:param value="#{item.id}" name="setupbox_id"></f:param>
										<f:param value="#{item.image}" name="setupbox_image"></f:param>
										<img src="images/icon_delete.png" title="#{msg['btn_delete']}" />
									</p:commandLink>
									<p:commandLink onclick="dlg2.show()"
										update=":dlgform2:dlgupdate," style="margin-left: 10px">
										<f:param value="update" name="action"></f:param>
										<f:param value="#{item.id}" name="setupbox_id"></f:param>
										<f:param value="#{item.image}" name="image"></f:param>
										<img src="images/icon_edit.png" title="#{msg['btn_edit']}" />
									</p:commandLink>

								</h:form>

							</p:column>
						</p:dataTable>
					</h:form>
				</h:panelGroup>
			</div>
		</div>
	</div>


	<ui:insert name="footer">
		<ui:include src="/footer/footer_dth.xhtml" />
	</ui:insert>
</h:body>
</html>